<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <div class="box">
      <div class="boxL">
        <div class="boxL1">
            <div class="txt">校园风光</div>
            <div class="TXT">XIAO YUAN FENG GUANG</div>
        </div>
        <div class="boxL2"></div>
      </div>
      <div class="boxR">
      <div class="boxR1"></div>
      <div class="boxR2">
        <div class="TXT">XUE SHU YAN JIU</div>
        <div class="txt">学术研究</div>
      </div>
      <div class="boxR3"></div>
      <div class="boxR4">
        <div class="txt">学生活动</div>
        <div class="TXT">XUE DHENG HUO DONG</div>
      </div>
      <div class="boxR5"></div>
      <div class="boxR6"></div>
    </div>
  </body>
  <style>
    .box {
      width: 1500px;
      height: 600px;
      background-color: #ad2f2f;
      margin: auto;
    }
    .boxL {
      width: 300px;
      height: 600px;
      background-color: #2bb3b3;
      float: left;
    }
    .boxR {
      width: 1200px;
      height: 600px;
      background-color: #a57834;
      float: left;
    }
    .boxL1 {
      width: 400px;
      height: 200px;
      background:url(../images/xyfg2.png) 25px center no-repeat #af251b;
      box-sizing: border-box;
      padding: 50px 0 0 30px;
      font-size: 30px;
      color: azure;
      float: left;
    }
    .boxL2{
        width: 400px;
        height: 400px;
        background-color: #24936e;
        background-image: url(fgt12.jpg);
        background-size: 400px 400px;
        float: left;
    }
    .TXT{
        font-size: 30px;
    }
    .boxR1 {
      width: 600px;
      height: 300px;
      background-color: #6d32a5;
      background-image: url(fgt11.jpg);
      background-size: 600px 300px;
      float: left;
    } 
    .boxR2{
        width: 200px;
        height: 300px;
        background-color: #b37a2f;
        box-sizing: border-box;
        padding: 20px 0 0 100px;
        font-size: 35px;
        writing-mode: vertical-lr;
        float: left;
    }
    .boxR3{
        width: 400px;
        height: 300px;
        background-color: #244d70;
        background-image: url(1.jpg);
        background-size: 400px 300px;
        float: left;
    }
    .boxR4{
        width: 350px;
        height: 300px;
        background-color: #26a865;
        box-sizing: border-box;
        padding: 50px 0 10px 30px;
        font-size: 35px;
        color: rgb(10, 32, 50);
        float: left;
    }
    .boxR5{
        width: 350px;
        height: 300px;
        background-color: #43b9b9;
        background-image: url(fgt14.jpg);
        background-size: 350px 300px;
        float: left;
    }
    .boxR6{
        width: 500px;
        height: 300px;
        background-color: #96682b;
        background-image: url(fgt13.jpg);
        background-size: 400px 300px;
        float: left;
    }
  </style>
</html>